<!DOCTYPE html>
<html>
{include file="public/header" /}
<body>

<div class="layui-fluid" id="app" style="margin-top: 0px">

    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">

            <div class="layui-card">

                <div class="layui-card-body">

                    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                        <div class="layui-tab-content" style="padding-left: 0px;padding-right: 0px">


                            <div class="layui-tab-item layui-show" style="padding-top: 15px">
                                <form class="layui-form " action="">

                                    <div class="layui-form-item">
                                        <label class="layui-form-label">名称</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="pinpai" value=""  class="layui-input">
                                        </div>
                                    </div>

                                    <div class="layui-form-item">
                                        <label class="layui-form-label">图片</label>

                                        <div class="layui-input-inline " style="width: auto;">

                                            <div class="layui-upload-drag" id="pic1" style="padding: 2px">
                                                <img class="layui-upload-img" style="width: 120px;height: 120px; object-fit: cover;" src="/res/img/logo.png" id="im">
                                                <input type="hidden" name="pinpai_logo" value="" >
                                            </div>

                                        </div>
                                    </div>

                                    <div class="layui-form-item">
                                        <div class="layui-input-block" style="padding-top: 15px">
                                            <button class="layui-btn" type="button" lay-submit lay-filter="pinpai">确认</button>
                                            <button type="reset" class="layui-btn layui-btn-primary" onclick="restart()">重新添加</button>
                                        </div>
                                    </div>
                                </form>
                            </div>

                        </div>
                    </div>


                </div>


            </div>
        </div>
    </div>
    <script>


        layui.use(['form','upload'], function () {
            var $ = layui.$
                , layer = layui.layer
                , form = layui.form;
            var upload = layui.upload;

            //监听提交
            form.on('submit(pinpai)', function (obj) {
//            layer.msg(JSON.stringify(obj.field));
                $.post("{:url('addpinpai')}", obj.field, function (res) {
                    if (res.code == 1) {
                        layer.msg(res.msg, {icon: 1});
                        parent.init();
                        $('#pic1 img').attr('src','/res/img/thumb.png');
                        $('.layui-form')[0].reset();
                        return false;
                    } else {
                        layer.msg(res.msg, {icon: 2}, function () {

                        })
                        return false;
                    }

                });
                return false;
            });

            //拖拽上传
            upload.render({
                elem: '#pic1'
                ,url: '/tool/qiniu/upload'
                ,before:function () {
                    layer.load(2);
                }
                ,done: function(res){
                    layer.closeAll();
                    console.log(res)
                    $('#pic1 img').attr('src',res.data.url);
                    $('#pic1 input').val(res.data.pic);
                }
            });
        });
        //重新选择图片
        function restart(){
            $('#im').attr('src','/res/img/logo.png');
        }
    </script>
</div>
</body>
</html>










